import type { Plugin } from 'postcss';
import type { Options } from './type';
const defaultOptions = {
  viewPortWidth: 375,
  mediaQuery: false,
  unitToConvert: 'custom'
}
export const pxToViewport = (options: Options = defaultOptions): Plugin => {
  // assign 将一个或多个源对象的属性复制到目标对象
  const opt = Object.assign({}, defaultOptions, options)
  return {
    postcssPlugin: 'postcss-px-to-viewport', // 名称
    // css 节点都会经过这个钩子
    Declaration(node) {
      console.log('属性名：', node.prop, '  属性值：', node.value);
      const value = node.value;
      // 匹配到 px 就转换成 vw
      if (value.includes(opt.unitToConvert)) {
        const num = parseFloat(value)
        const transform = (num / opt.viewPortWidth) * 100 //转 vw
        node.value = `${transform.toFixed(2)}vw` // 转换后的值
      }
    }
  };
};
